<!--
 * @Author: xiawei 1243162387@qq.com
 * @Date: 2024-03-29 12:02:44
 * @LastEditors: xiawei 1243162387@qq.com
 * @LastEditTime: 2024-11-27 01:01:50
-->
<template>
    <div class="base-app-loading" v-if="microApp.loading" v-loading="microApp.loading" element-loading-text="子应用加载中..."></div>
    <!-- <div id="microAppContainer"></div> -->
</template>
<script setup lang="ts">
import { start } from 'qiankun';
import { onMounted } from 'vue';
import microAppStore from '@/stores/microApp';
const microApp = microAppStore()
onMounted(() => {
    if (!window.qiankunStarted) {
        window.qiankunStarted = true;
        start({
            sandbox : {
                 // strictStyleIsolation: true,
                 experimentalStyleIsolation : true
            }
        });
    }
})
</script>
<style lang="scss">
.base-app-loading{
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
}
#microAppContainer{
    overflow: auto;
    flex: 1;
    &>div{
        height: 100%;
        width: 100%;
        overflow: hidden;
    }
}
</style>